<!--页面主要内容-->
<main class="lyear-layout-content">

  <div class="container-fluid p-t-15">

    <div class="row">
      <div class="col-lg-12">
        <div class="card">
          <span class="layui-breadcrumb">
            <a href="">首页</a>
            <a href="">用户管理</a></a>
            <a><cite>用户列表</cite></a>
          </span>
          <div class="card-toolbar d-flex flex-column flex-md-row">
            <div class="toolbar-btn-action">
              <a class="btn btn-primary m-r-5" href="{:url('admin/User/add')}"><i class="mdi mdi-plus"></i> 新增</a>
              <a class="btn btn-danger delAll"><i class="mdi mdi-window-close"></i> 批量删除</a>
            </div>

            <form class="layui-form" id="layui-form" method="get" role="form" style="display: flex;">
              <input type="hidden" name="action" value="search">
              <select name="search" id="search" lay-filter="search">
                <option value="nickname">昵称</option>
                <option value="email">邮箱</option>
                <option value="sex">性别</option>
              </select>   
              <input type="text" name="title" placeholder="请选择搜索条件" autocomplete="off" class="layui-input">  
              <button class="layui-btn layui-btn-primary" type="submit">搜索</button>
            </form>
          </div>

          <div class="card-body">
            <div class="table-responsive">
              <table class="table table-bordered">
                <thead>
                  <tr>
                    <th>
                      <div class="custom-control custom-checkbox">
                        <input type="checkbox" class="custom-control-input" id="check-all">
                        <label class="custom-control-label" for="check-all"></label>
                      </div>
                    </th>
                    <th>编号</th>
                    <th>邮箱</th>
                    <th>昵称</th>
                    <th>头像</th>
                    <th>性别</th>
                    <th>个性签名</th>
                    <th>地址</th>
                    <th>积分</th>
                    <th>会员等级</th>
                    <th>状态</th>
                    <th>操作</th>
                  </tr>
                </thead>
                <tbody>
                  {foreach $UserList as $key => $item}
                  <tr>
                    <td>
                      <div class="custom-control custom-checkbox">
                        <input type="checkbox" class="custom-control-input ids" name="ids[]" value="{$item.id}" id="{$item.id}">
                        <label class="custom-control-label" for="{$item.id}"></label>
                      </div>
                    </td>
                    <td>{$key+1}</td>
                    <td>{$item.email}</td>
                    <td>{$item.nickname}</td>
                    <td><img src="{$item.avatar ? $item.avatar : '/static/home/res/images/avatar/default.png'}" alt="" style="width: 70px;"></td>
                    <td>{$item.sex_text}</td>
                    {if condition="$item.content == null"}
                      <td style="color: #b8b3ad;">这个人很懒，什么也没留下</td>
                    {else}
                      <td>{$item.content}</td>
                    {/if}
                    {if condition="$item.provinces != null"}
                      <td>{$item.provinces.name}-{$item.citys.name}-{$item.districts.name}</td>
                    {else}
                      <td>保密</td>
                    {/if}
                    <td>{$item.point}</td>
                    <td>{$item.vip}</td>
                    <td>
                    {if condition="$item.auth == 1"}
                      <button class="layui-btn layui-btn-radius layui-btn-normal layui-btn-sm">已认证</button>
                      {else}
                      <button class="layui-btn layui-btn-radius layui-btn-danger layui-btn-sm">未认证</button>
                    {/if}
                    </td>
                    <td>
                      <div class="btn-group">
                          <!-- 积分消费记录 -->
                        <a class="btn btn-xs btn-default ajax-get confirm record" data-id="{$item.id}"
                        href="{:url('admin/user/record', ['userid' => $item.id])}"
                          title="" data-toggle="tooltip" data-original-title="积分记录">
                          <i class="mdi mdi-file-document-box-check-outline"></i></a>
                      </div>
                      <div class="btn-group">
                          <!-- 删除 -->
                        <a class="btn btn-xs btn-default ajax-get confirm del" data-id="{$item.id}"
                          title="" data-toggle="tooltip" data-original-title="删除">
                          <i class="mdi mdi-window-close"></i></a>
                      </div>
                    </td>
                  </tr>
                  {/foreach}
                </tbody>
              </table>
            </div>
            <!-- 分页 -->
          {$UserList->render()}
          </div>
        </div>
      </div>

    </div>

  </div>

</main>
<!--End 页面主要内容-->

<script>
  layui.use(['layer'], function () {
    var $ = layui.jquery,
    layer = layui.layer

    $('.del').click(function() {
      let id = $(this).data('id');

      layer.confirm('确定删除该用户？', { icon: 3, title: '提示' }, function (index) {
        // 发起请求
        $.ajax({
          type: 'post',
          url: `{:url('admin/user/del')}`,
          data: {
            id
          },
          dataType: 'json',
          success: function (res) {
            if (res.code == 1) {
              layer.msg(res.msg, { icon: 1, time: 1500 }, function (index) {
                location.href = res.url
                // location.reload()
                layer.close(index)
              })
            } else {
              layer.msg(res.msg, { icon: 2, time: 1500 }, function (index) {
                layer.close(index)
                location.reload()
              })
            }
          }
        })
        layer.close(index)
      })
    })

    $('.edit').click(function() {
      let id = $(this).data('id')
      console.log(id)
    })

    // 批量删除
    $('.delAll').click(function () {
      layer.confirm('确定批量删除？', { icon: 3, title: '提示' }, function (index) {
        let list = GetId()
        if (list.length == 0) {
          // alert("至少选择一条帖子!")
          layer.alert('至少选择一名用户!')
          return false
        }
        // console.log(list)
        $.ajax({
          type: 'post',
          url: `{:url('admin/user/delAll')}`,
          data: {
            list,
            // action: 'delAll'
          },
          dataType: 'json',
          success: function (res) {
            if (res.code == 1) {
              layer.alert(res.msg, function (index) {
                // location.reload()
                location.href = res.url
                layer.close(index);
              });
            } else {
              layer.alert(res.msg, function (index) {
                location.reload()
                layer.close(index);
              });
            }
          }
        })
        layer.close(index)
      })
    })

    function GetId () {
      // 存放id的数组
      let list = []
      $('input[name="ids[]"]:checked').each(function () {
        // console.log(item);
        list.push($(this).val())
      })
      return list
    }
  })
</script>
